@extends('frontend::login.common')
<link href="{{asset(config('view.frontend.wap_login').'/css/mui.picker.css')}}" rel="stylesheet" />
<link href="{{asset(config('view.frontend.wap_login').'/css/mui.poppicker.css')}}" rel="stylesheet" />
@section('content')

    <div class="mui-taber">
        <span data-url="{{route('f_Login_login')}}">登录</span>
        <span class="active" data-url="{{route('f_Login_register')}}">注册</span>
    </div>
    <form action="{{url()->current()}}" id="register-form" class="form2 active" method="post">
        {{csrf_field()}}
        <div class="mui-input-group">
            <i class="fa fa-user"></i>
            <input type="text" name="user_number" placeholder="请输入用户编号"  />
        </div>
        {{--<div class="mui-input-group">--}}
        {{--<i class="fa fa-user"></i>--}}
        {{--<input type="text" name="name" placeholder="请输入用户名"  />--}}
        {{--</div>--}}
{{--        <div class="mui-input-group">--}}
{{--            <i class="fa fa-user"></i>--}}
{{--            <input type="text" name="nickname" placeholder="请输入昵称"  />--}}
{{--        </div>--}}

        <div class="mui-input-group">
            <i class="fa fa-phone"></i>
            <input type="text" name="phone" id="phone" placeholder="填写手机号"  />
        </div>
{{--        <div class="mui-input-group" style="display:block;">--}}
{{--            <i class="fa fa-envelope" style="font-size: 13px;"></i>--}}
{{--            <input type="text" name="phone_code" placeholder="手机验证码"  />--}}
{{--            <button type="button" id="send_code" style="top: 7px;width: 60px;height: 25px;line-height: 15px;right: 10px;background: #f0f6fd;color: #225181;font-size: 12px;border-radius: 16px;">验证码</button>--}}
{{--        </div>--}}
        <div class="mui-input-group">
            <i class="fa fa-lock"></i>
            <input type="password" name="login_pwd" placeholder="6-20位登录密码" value="123456" />
        </div>
        <div class="mui-input-group">
            <i class="fa fa-lock"></i>
            <input type="password" name="re_login_pwd" placeholder="再次确认密码" value="123456" />
        </div>
        <div class="mui-input-group">
            <i class="fa fa-lock"></i>
            <input type="password" name="pay_pwd" placeholder="六位数支付密码" value="123456" />
        </div>
        <div class="mui-input-group">
            <i class="fa fa-lock"></i>
            <input type="password" name="re_pay_pwd" placeholder="确认支付密码"  value="123456" />
        </div>

{{--        <div class="mui-input-group ">--}}
{{--            <i class="fa fa-arrow-up "></i>--}}
{{--            <input type="text"  id='showSysLevel' readonly  placeholder="请选择注册等级" value=""--}}
{{--                   data-sys_level ={{json_encode(config('shop.level'))}} data-bill_money="{{json_encode(format_rule(json_decode(get_rule('bill_money'))))}}">--}}
{{--            <input type="hidden" name="level" id='level' value="">--}}
{{--        </div>--}}

        <div class="mui-input-group">
            <i class="fa fa-tumblr-square"></i>
            <input type="text" name="share_code" placeholder="请输入邀请码" value="{{$code}}" />
        </div>
        <div class="mui-input-group">
            <i class="fa fa-adn"></i>
            <input type="text" name="jiedian" placeholder="输入节点人编号" value="" />
        </div>

{{--        <div class="mui-input-group">--}}
{{--            <i class="fa fa-skype"></i>--}}
{{--            <input type="text" name="bdr" placeholder="请输入社区服务店工号" value="" />--}}
{{--        </div>--}}
        <button class="mui-btns btns2" type="button" style="margin-top: 30px;background: #5a92fd;color: #fff;height: 40px;width: 95%;">注册</button>
        <div class="mui-btns btns1" style="background: crimson;width: 95% ">
            <a target="_blank" style="color: aliceblue;" href="./dapp.html">下载app</a>
        </div>
    </form>
@endsection
@push('scripts')
    <script>
        randNumber2037(6);
        function randNumber2037(size) {
            var seedUppercase = new Array(
                'A','B','C','D','E','F','G','H','I','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z'
            );
            // var seedLowercase = new Array(
            //     'a','b','c','d','e','f','g','h','i','j','k','m','n','p','q','r','s','t','u','v','w','x','y','z'
            // );
            var seedDigit = new Array('0','1','2','3','5','6','7','8','9')

            var seedLength = seedDigit.length;//数组长度
            var randomVal = '';

            var prefixLength = seedUppercase.length;

            for (var i=0;i<2;i++) {
                var index = Math.floor(Math.random()*prefixLength);
                randomVal += seedUppercase[index];
            }
            for (var i=0;i<size;i++) {
                var j = Math.floor(Math.random()*seedLength);
                randomVal += seedDigit[j];
            }
            $('input[name="user_number"]').val(randomVal);
        }

        var code = '';
        var input = $('input');
        var phone =''
        //true就是可以发送
        var onoff = true;
        {{--//发送验证码--}}
        {{--$('#send_code')[0].addEventListener('tap',function(){--}}

        {{--    //false就不能发送--}}
        {{--    if(!onoff){--}}
        {{--        return;--}}
        {{--    }--}}
        {{--    onoff = false;--}}
        {{--    //点击玩按钮干什么?--}}
        {{--    //发验证码?--}}
        {{--    // 1-给谁发? 手机号码--}}
        {{--    phone = $('input[name="phone"]').val();--}}
        {{--    if(phone == ''){--}}
        {{--        mui.toast('手机号码不能为空');--}}
        {{--        onoff = true;--}}
        {{--        return;--}}
        {{--    }--}}

        {{--    if(phone.length != 11){--}}
        {{--        mui.toast('手机号码位数不正确');--}}
        {{--        onoff = true;--}}
        {{--        return;--}}
        {{--    }--}}
        {{--    --}}
        {{--    // 2-验证码是什么? cast 可以生成一个随机码--}}
        {{--    code =getCode(phone);--}}

        {{--    // 3-发送 在这里我来使用一个定时器来模拟一下发送的时间, 大家可以使用第三方的短信平台，比如阿里大于，我们在学员专区内的功能模块开发里有2节视频，大家可以看--}}
        {{--    var num = 60;--}}
        {{--    var timer = setInterval(function(){--}}
        {{--        num--;--}}
        {{--        if(num == 0){--}}
        {{--            send_code.innerHTML = '发送验证码';--}}
        {{--            //定时器停了--}}
        {{--            clearInterval(timer);--}}
        {{--            onoff = true;--}}
        {{--        }else{--}}
        {{--            send_code.innerHTML = num + 'S';--}}
        {{--        }--}}
        {{--    },1000); // 1000 毫秒==1秒--}}


        {{--});--}}

        {{--function getCode(phone)--}}
        {{--{--}}
        {{--    $.ajaxSetup({--}}
        {{--        headers: {--}}
        {{--            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')--}}
        {{--        }--}}
        {{--    });--}}
        {{--    $.ajax({--}}
        {{--        type: 'post',--}}
        {{--        url: "{{route('f_Login_sendPhoneCode')}}",--}}
        {{--        dataType: 'json',--}}
        {{--        data: {phone:phone}--}}
        {{--    }).done(function (response) {--}}
        {{--        if(response.status){--}}
        {{--            mui.toast(response.msg);--}}
        {{--        }else{--}}
        {{--            mui.toast(response.msg);--}}
        {{--        }--}}
        {{--    }).fail(function (XMLHttpRequest) {--}}
        {{--        if (XMLHttpRequest.status == 422) {--}}
        {{--            var errors = XMLHttpRequest.responseJSON.errors;--}}
        {{--            if(typeof errors == 'object') {--}}
        {{--                for (var index in errors) { // 不推荐这样--}}
        {{--                    mui.toast(errors[index][0]);--}}
        {{--                    break;--}}
        {{--                }--}}
        {{--            }else{--}}
        {{--                mui.toast(XMLHttpRequest.responseJSON.msg);--}}

        {{--            }--}}
        {{--        }else{--}}
        {{--            mui.toast('网络异常,请检查连接');--}}
        {{--        }--}}

        {{--    }).always(function () {--}}

        {{--    });--}}
        {{--}--}}

        $('.btns2')[0].addEventListener('click',function(){
            var load =  layer.open({type: 2});
            $.ajax({
                type: 'post',
                url: $('#register-form').attr('action'),
                dataType: 'json',
                data: $('#register-form').serialize()
            }).done(function (response) {
                if(response.status){
                    tooltips(response.msg,6);
                    setTimeout(function () {
                        location.href = response.url;
                    }, 2000);
                }else{
                    tooltips(response.msg,5);
                }
            }).fail(function (XMLHttpRequest) {
                if (XMLHttpRequest.status == 422) {
                    var errors = XMLHttpRequest.responseJSON.errors;
                    if(typeof errors == 'object') {
                        for (var index in errors) { // 不推荐这样
                            tooltips(errors[index][0]);
                            break;
                        }
                    }else{
                        tooltips(XMLHttpRequest.responseJSON.msg);

                    }
                }else{
                    tooltips('网络异常,请检查连接');
                }

            }).always(function () {
                layer.close(load);
            });

            function tooltips(msg) {
                layer.open({
                    content: msg
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }
        })
    </script>

    <script src="{{asset(config('view.frontend.wap_login').'/js/mui.picker.js')}}"></script>
    <script src="{{asset(config('view.frontend.wap_login').'/js/mui.poppicker.js')}}"></script>

    <script type="text/javascript">

        var levelPicker = new mui.PopPicker()
        var showLevelPickerButton = document.getElementById('showSysLevel');

        var sys_levelData = showLevelPickerButton.dataset.sys_level;
        sys_levelData = JSON.parse(sys_levelData)
        var sys_bill_money = showLevelPickerButton.dataset.bill_money;
        sys_bill_money = JSON.parse(sys_bill_money)
        console.log(sys_bill_money)
        var levelData = []
        var data = '';
        mui.each(sys_levelData,function(index,item){
            data = {
                'value':index,
                'text': item +'---'+ sys_bill_money[index][1]
            }
            levelData.push(data)
         })
        levelPicker.setData(levelData);
        showLevelPickerButton.addEventListener('tap', function(event) {
            levelPicker.show(function (items) {
                $(showLevelPickerButton).val( items[0].text )
                $("#level").val(items[0].value);
                //返回 false 可以阻止选择框的关闭
                //return false;
            });
        })
    </script>
@endpush